<template>

  <div class="table">

    <el-table ref="tableDataRef" :data="tableData" style="width: 100%" show-overflow-tooltip
      @selection-change="handleSelectionChange">
      <el-table-column
        type="selection"
        width="55"
        fixed
      />
      <el-table-column type="index" label="序号" width="70" />
      <el-table-column prop="name" label="模板名称" />
      <el-table-column prop="version" label="版本号" />
      <el-table-column prop="industry" label="适用行业">
      </el-table-column>
      <el-table-column prop="affiliatedModule" label="所属模块" />
      <el-table-column prop="createName" label="上传人" />
      <el-table-column prop="createTime" label="上传时间" />
      <el-table-column label="操作" width="140">
        <template #default="scope">
          <el-button text type="info" class="other-btn" @click="handleInfo(scope.row)">查看</el-button>
          <el-button class="other-btn" type="primary" text @click="handleGetApplication(scope.row)">预览</el-button>
        </template>
      </el-table-column>
    </el-table>

    <Pagination class="pagination" :total="pagination.total" :page="pagination.page" :limit="pagination.limit"
      :pageSizes="pagination.pageSizes" @handleSizeChange="sizeChange" @handleCurrentChange="currentChange">
    </Pagination>
    
  </div>


</template>

<script setup>
import Pagination from "@/components/Pagination/pageination.vue";
const emit = defineEmits([
  "handleInfo",
  "sizeChange",
  "currentChange",
  "handleGetApplication",
  "handleSelectionChange",
]);
const selectable = (row, index) => {
  return row.isTakeDown; // 如果 row.disabled 为 true，则禁用复选框
};
const props = defineProps({
  isShowBtn: Boolean,
  tableData: Array,
  currentTabs: String,
  pagination: {
    type: Object,
    required: true,
    default: () => ({
      total: 10,
      page: 1,
      limit: 10,
      pageSizes: 10,
    }),
  },
});

// 查看
const handleInfo = (row) => {
  emit("handleInfo", row);
};
// 选择
const handleSelectionChange = (val) => {
  emit("handleSelectionChange", val);
};

// 编辑
const handleGetApplication = (row) => {
  emit("handleGetApplication", row);
};

const sizeChange = (size) => {
  console.log(size, "size");
  emit("sizeChange", size);
};
const currentChange = (page) => {
  console.log(page, "1");
  emit("currentChange", page);
};
</script>
<style scoped>
.pagination {
  margin-top: 15px;
}
</style>